/**
 * @flow
 */

import React from 'react';
import { Button, ScrollView, Image ,StyleSheet} from 'react-native';
import { StackNavigator, TabNavigator } from 'react-navigation';

import Ionicons from 'react-native-vector-icons/Ionicons';

import HomeView from '../Home/HomeView';
import TaskView from '../Task/TaskView';
import NoticeView from '../Notice/NoticeView';
import MyView from '../My/MyView';

import NoticeDetailView from '../Notice/NoticeDetailView'

const MainTab = TabNavigator({
  JNTecTab0: {
    screen: HomeView,
    path: '/',
    navigationOptions: {
      tabBarLabel: '首页',
      tabBarIcon: ({ tintColor, focused }) => (
        <Image source={focused?require('./tab_shouye_p.png'):require('./tab_shouye_n.png')} style={styles.iconSize}/>
      ),
    },
  },
  JNTecTab1: {
    screen: NoticeView,
    path: '/settings',
    navigationOptions: {
      tabBarLabel: '通知',
      tabBarIcon: ({ tintColor, focused }) => (
        <Image source={focused?require('./tab_tongzhi_p.png'):require('./tab_tongzhi_n.png')} style={styles.iconSize}/>
      ),
      label:'xzoacar'
    },
  },
  JNTecTab2: {
    screen: TaskView,
    path: '/settings',
    navigationOptions: {
      tabBarLabel: '任务',
      tabBarIcon: ({ tintColor, focused }) => (
        <Image source={focused?require('./tab_renwu_p.png'):require('./tab_renwu_n.png')} style={styles.iconSize}/>
      ),
    },
  },
  JNTecTab3: {
    screen: MyView,
    path: '/settings',
    navigationOptions: {
      tabBarLabel: '我的',
      tabBarIcon: ({ tintColor, focused }) => (
        <Image source={focused?require('./tab_wode_p.png'):require('./tab_wode_p.png')} style={styles.iconSize}/>
      ),
    },
  },
},{
  tabBarPosition: 'bottom',
  animationEnabled: false,
  swipeEnabled: false,
  tabBarOptions: {
    activeTintColor: '#0dc2ca',
  },
  lazy: true,
});

const StacksOverTabs = StackNavigator({
    MainTab: {
      screen: MainTab,
    },
    NoticeDetailView :{
      screen:NoticeDetailView,
      navigationOptions:{
        title:'xzoscar'
      },
    }
},{
  headerMode:'none',
});

<StacksOverTabs screenProps={{v1:'xxx'}}/>

const styles = StyleSheet.create({
  iconSize:{
    width:26,
    height:26,
  },
});

export default StacksOverTabs
